<template>
  <a-card class="ax_sticky_top">
    <template #title>
      岗位信息列表
    </template>
    <template #extra>
      <a-tooltip title="前往帮助中心">
        <a class="system__icon" target="_blank">
          <QuestionCircleTwoTone />
        </a>
      </a-tooltip>
    </template>
    <div class="mb-12 grid grid-cols-6 gap-4">
      <a-input v-model:value="postTable.query.postCode" class="flex-1" placeholder="请输入岗位编码" @press-enter="postSearch"
        allow-clear></a-input>
      <a-input v-model:value="postTable.query.postName" class="flex-1" placeholder="请输入岗位名称" @press-enter="postSearch"
        allow-clear></a-input>
      <a-input v-model:value="postTable.query.postDesc" class="flex-1" placeholder="请输入描述信息" @press-enter="postSearch"
        allow-clear></a-input>
      <a-input v-model:value="postTable.query.commentId" class="flex-1" placeholder="请输入评论ID" @press-enter="postSearch"
        allow-clear></a-input>
      <div class="text-right">
        <a-button type="primary" @click="postSearch">搜索</a-button>
      </div>
    </div>
    <a-flex justify="space-between" :align="'center'">
      <a-flex justify="space-between" :align="'center'">
        <a-flex :align="'center'" :gap="4">

          <div v-perm="'system:post:add'">
            <a-tooltip title="新建">
              <a-button type="primary" @click="postCreate">
                <PlusOutlined />
              </a-button>
            </a-tooltip>
          </div>

          <div v-perm="'system:post:edit'">
            <a-tooltip title="编辑">
              <a-button type="link" @click="postEdit()" :disabled="postTable.keys.length !== 1">
                <EditOutlined />
              </a-button>
            </a-tooltip>
          </div>
          <div v-perm="'system:post:list'">
            <a-tooltip title="刷新">
              <a-button type="link" @click="postList">
                <SyncOutlined />
              </a-button>
            </a-tooltip>
          </div>
          <div v-perm="'system:post:remove'">
            <a-popconfirm title="确定要删除吗" :disabled="postTable.keys.length === 0" placement="bottomRight"
              @confirm="postDelete()">
              <a-tooltip title="批量删除">
                <a-button danger type="link" :disabled="postTable.keys.length === 0">
                  <DeleteOutlined />
                </a-button>
              </a-tooltip>
            </a-popconfirm>
          </div>
        </a-flex>

      </a-flex>
      <a-flex>
        <div v-perm="'system:post:export'">
          <a-tooltip title="下载数据">
            <a-button type="link" @click="postExport">
              <DownloadOutlined />
            </a-button>
          </a-tooltip>
        </div>
        <div v-perm="'system:post:add'">
          <a-tooltip title="导入数据">
            <a-button type="link" @click="postImport">
              <UploadOutlined />
            </a-button>
          </a-tooltip>
        </div>

        <FieldVue :raw="postRawColumns" v-model:columns="postColumns" :module-name="postTable.moduleName" />
        <div>
          <a-tooltip title="卡片模式" @click="postTable.viewMode = 'card'" v-if="postTable.viewMode === 'table'">
            <a-button type="link">
              <OrderedListOutlined />
            </a-button>
          </a-tooltip>

          <a-tooltip title="表格模式" @click="postTable.viewMode = 'table'" v-else>
            <a-button type="link">
              <AppstoreAddOutlined />
            </a-button>
          </a-tooltip>
        </div>
      </a-flex>
    </a-flex>
  </a-card>
</template>

<script setup lang="ts">
import {
} from '../../data/options';
import FieldVue from '@/views/components/table/Field.vue';
import { postColumns, postRawColumns } from '../../data/column';
import {
  postCreate,
  postDelete,
  postEdit,
  postList,
  postSearch,
  postImport,
  postExport
} from '../../data/curd';
import { postTable } from '../../data/table';


</script>

<style lang="scss" scoped></style>
